<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="//apps.bdimg.com/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
    <script src="//apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
    <!--    <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>-->
    <script type="text/javascript" src="https://g.alicdn.com/dingding/dingtalk-jsapi/2.10.3/dingtalk.open.js"></script>
    <link rel="stylesheet" type="text/css" href="../css/style.css">
    <link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css">
</head>
<script>
    function showCheck(jsonArray){
        //清空table
        var table = document.getElementById("tab2");
        arr = table.getElementsByTagName("tr");
        //不能用i++的方式去删除，双数行删不掉，删掉第一行的时候第二行变成第一行，下一次删的是第三行。
        //所以采用从最后开始的删除方法。
        for(var i=arr.length-1;i>0;i--){
            table.deleteRow(i);
        }

        var str = "";

        var length=jsonArray.length;
        for (var i=0;i<length;i++){
            str = "<tr><td><input type='checkbox' id="+ i +" /></td><td>"
                +jsonArray[i].checkid+"</td><td>"
                +jsonArray[i].true_id+"</td><td>"
                +jsonArray[i].rname+"</td><td>"
                +jsonArray[i].initial_uid+"</td><td>"
                +jsonArray[i].uname+"</td><td>"
                +jsonArray[i].completetime+"</td><td>"
                +jsonArray[i].error+"</td><td>"
                +jsonArray[i].tips+"</td><tr>"
            // + "<div><button type='button' id='updateBtn' >修改</button>" +
            // "<button type='button' id='deleteBtn' >删除</button></div>" +
            // "</td></tr>"
            $("#tab2").append(str)
        }
    }

    function showData(jsonArray){
        //清空table
        var table = document.getElementById("tab");
        arr = table.getElementsByTagName("tr");
        //alart(arr.length);
        //不能用i++的方式去删除，双数行删不掉，删掉第一行的时候第二行变成第一行，下一次删的是第三行。
        //所以采用从最后开始的删除方法。
        for(var i=arr.length-1;i>0;i--){
            table.deleteRow(i);
        }

        var str = "";
        var length=jsonArray.length;
        for (var i=0;i<length;i++){
            str = "<tr><td><input type='checkbox' id='checkid' value="+ i +"/></td><td>"
                +jsonArray[i].checkid+"</td><td>"
                +jsonArray[i].starttime+"</td><td>"
                +jsonArray[i].completetime+"</td><td>"
                +jsonArray[i].uname+"</td><td>"
                +jsonArray[i].tips+"</td><td>"
            + "<div><button type='button' id='show' >详细</button>" +
            "<button type='button' id='deleteBtn' >删除</button>" +
                // "<button type='button' id='export' >导出</button></div>" +
            "</td></td>"
            $("#tab").append(str)
        }
    }

    $(function (){
        $.ajax({
            url:"/showAllCheckId",
            type:"post",
            dataType:"json",
            success:function(jsonArray){
                showData(jsonArray);
            },
            error:function (msg){
                alert("展示全部盘点批次失败！");
            }
        });

        $("#dialog").hide();

        $("#startcheck").click(function (){
            $("#dialog").dialog();
        });

        $(document).on('click','#show',function (){
            var checkid = $(this).parents("tr").find("td").eq(1).text();
            $.ajax({
                type:"post",
                dataType:"json",
                url:"/showCheckByCheckid",
                data:{
                    "checkid":checkid,
                },
                success:function (msg){
                    showCheck(msg);
                },
                error:function (msg){
                    alert("查询详细盘点数据失败了！")
                }
            })
        })

        $(document).on('click','#export',function () {
            var list = new Array();


            var input = document.getElementsByTagName("input")
            var length = input.length
            for (var i=0;i<length;i++){
                var obj = input[i];
                if (obj.type == "checkbox" && obj.checked && obj.id=="checkid") {
                    var checkid = $(input[i]).parents("tr").find("td").eq(1).text();
                    list.push(checkid)
                    alert(i+"   "+checkid)
                }
            }
            alert(list)
            $.ajax({
                type: "post",
                dataType: "text",
                url: "/export",
                traditional:true,
                data: {
                    list: list
                },
                success: function (list) {
                    alert("导出至："+list)
                },
                error: function (msg) {
                    alert(msg)
                }
            })
        })
            // var checkid = $(this).parents("tr").find("td").eq(1).text();
            // alert("导出的单号是："+checkid)
            // $.ajax({
            //     type:"post",
            //     dataType:"json",
            //     url:"/export",
            //     data:{
            //         "checkid":checkid,
            //     },
            //     success:function (msg){
            //         showData("成功！"+msg);
            //     },
            //     error:function (msg){
            //         alert("打印失败:"+msg)
            //     }
            // })
        // })

        $("#check_submit").click(function (){
            var completetime = $("#completetime").val();
            var tips = $("#tips").val();
            $.ajax({
                type:"post",
                dataType:"json",
                url:"/insertCheckId",
                data:{
                    "completetime":completetime,
                    "tips":tips,
                },
                success:function (msg){
                    $("#dialog").hide();
                    showData(msg);
                },
                error:function (){
                    $("#dialog").hide();
                    alert("创建新的盘点单失败，\n请检查是否有未过截止时间的盘点单存在！");
                }
            })
        })

        //点击全选来全选
        $("#checkAll").click(function (){
            var code = document.getElementsByTagName("input");
            for (i=0;i<code.length;i++){
                if (code[i].type == 'checkbox'){
                    code[i].checked = true;
                }
            }
        })

        //点击取消来取消全选
        $("#unCheckAll").click(function (){
            var code = document.getElementsByTagName("input");
            for (i=0;i<code.length;i++){
                if (code[i].type == 'checkbox'){
                    code[i].checked = false;
                }
            }
        })

        $(document).on('click','#deleteBtn',function (){
            var msg = "确认删除该次盘点单吗？";
            if(confirm(msg)==true) {
                var checkid = $(this).parents("tr").find("td").eq(1).text();
                $.ajax({
                    url: "/deleteCheckId",
                    type: "post",
                    dataType: "json",
                    data: {
                        "checkid": checkid,
                    },
                    success: function (jsonArray) {
                        alert("删除成功！");
                        showData(jsonArray);
                    },
                    error: function (msg) {
                        alert("删除失败，原因是：\n\n" + msg);
                    }
                });
            }
            else{
                alert("取消删除!");
            }
        })

        //限制输入的时间必须超过今天
        $(function(){
            //得到当前时间
            var date_now = new Date();
            //得到当前年份
            var year = date_now.getFullYear();
            //得到当前月份
            //注：
            //  1：js中获取Date中的month时，会比当前月份少一个月，所以这里需要先加一
            //  2: 判断当前月份是否小于10，如果小于，那么就在月份的前面加一个 '0' ， 如果大于，就显示当前月份
            var month = date_now.getMonth()+1 < 10 ? "0"+(date_now.getMonth()+1) : (date_now.getMonth()+1);
            //得到当前日子（多少号）
            var date = date_now.getDate() < 10 ? "0"+date_now.getDate() : date_now.getDate();
            //设置input标签的max属性
            $("#completetime").attr("min",year+"-"+month+"-"+date);
        })
    })
</script>

<body>
<button type="button" id="startcheck">发起盘点</button>
<button type="button" id="checkAll">全选</button>
<button type="button" id="unCheckAll">取消选择</button>
<button type="button" id="export">导出选择项</button>
<table id="tab" border="1px" >
    <tr>
        <td width="20px"></td>
        <td width="30px">批次序号</td>
        <td width="60px">发起时间</td>
        <td width="60px">截止时间</td>
        <td width="60px">发起人</td>
        <td width="100px">备注</td>
        <td width="30px">操作</td>
    </tr>
</table>
<table id="tab2" border="1px" >
    <tr>
        <td width="20px"></td>
        <td width="30px">批次</td>
        <td width="60px">资产编号</td>
        <td width="60px">资产名称</td>
        <td width="60px">员工工号</td>
        <td width="60px">员工名</td>
        <td width="60px">结束时间</td>
        <td width="60px">盘点状态</td>
        <td width="100px">备注</td>
    </tr>
</table>
<div id="dialog" title="新建盘点批次" >
    <form>
        <fieldset>
            <label for="completetime">结束时间</label>
            <input type="date" name="completetime" id="completetime" value="">
            <br><label for="tips">备注</label>
            <input type="text" name="tips" id="tips" >
            <br><button type="button" id="check_submit">提交</button>
        </fieldset>
    </form>
</div>
</body>
</html>